<template>
	<div class="u-flex u-row-between u-col-center"
		@click="$u.route({url:'/pagesC/shop/storeDetails',params:{shop_id:getShopperInfo.shop_id}})">
		<u-avatar :src="getShopperInfo.shop_logo" :show-level="getShopperInfo.shop_level>0" size="mini"></u-avatar>
		<div style="width:70%">
			<h4 class="shopperName" :style="$u.color['contentColor']">{{getShopperInfo.shop_name}}</h4>
			<div class=" u-font-xs u-flex" :style="{color:$u.color['tipsColor']}">
				<p class="u-line-1 shopperName2" style="width:50%" :style="{color:$u.color['contentColor']}">
					{{getShopperInfo.shop_desc}} </p>
				<span> {{$u.timeFrom(new Date(info.news_info.time), 'mm-dd') }}</span>
			</div>
		</div>
		<u-tag text="进店" type="warning" shape="circle" style="justify-self:flex-end"></u-tag>
	</div>
</template>

<script>
	export default {
		name: "shopperCardHeader",
		data() {
			return {

			}
		},
		props: {
			info: {
				type: Object,
				default: () => {
					{}
				}
			}
		},
		computed: {
			getShopperInfo() {
				return this.info.shop_info
			}
		}
	}
</script>

<style lang="scss">
	.u-flex {
		display: flex;
	}

	.shopperName {
		font-size: 30upx;
	}

	.shopperName2 {
		font-size: 24upx;
		color: #999;
	}

	.u-row-between {
		justify-content: space-between;
	}

	.u-col-center {
		align-items: center;
	}

	.u-font-xs {
		font-size: 24upx;
	}
</style>
